import React from 'react';
import { Layout, theme ,Menu , Modal} from 'antd';
import { ExclamationCircleFilled } from '@ant-design/icons';
import {useNavigate} from 'react-router-dom';
const { Header} = Layout;
const { confirm } = Modal;
const items1 = [{
        key: "userCenter",
        label: "个人中心"
    },
    {
        key: "exit",
        label: "退出登录"
    }];

export default function MyHeader(){
	const navigate = useNavigate();
	const userInfo = JSON.parse(localStorage.userInfo);
	function onchoose(val) {
	   // console.log(val)
	    switch (val.key) {
	        case "userCenter":
	            break;
	        case "exit":
	            confirm({
	                title: '你确定要退出吗?',
	                icon: <ExclamationCircleFilled />,
	                onOk() {
	                    localStorage.clear();
	                    navigate("/login")
	                },
	                onCancel() {
	                    console.log('取消');
	                },
	            });
	    }
	}
	return (
	 <Header className="header">
	         <div className="logo" />
	         <Menu theme="dark" mode="horizontal" items={items1} onClick={onchoose}/>
	 </Header>
	)
}